<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="description" content="">
		<meta name="author" content="Mosaddek">
		<meta name="keyword" content="FlatLab, Dashboard, Bootstrap, Admin, Template, Theme, Responsive, Fluid, Retina">
		<link rel="shortcut icon" href="img/favicon.html">

		<title>用户列表</title>

		<!-- Bootstrap core CSS -->
		<link href="css/bootstrap.min.css" rel="stylesheet">
		<link href="css/bootstrap-reset.css" rel="stylesheet">
		<!--external css-->
		<link href="assets/font-awesome/css/font-awesome.css" rel="stylesheet" />
		<!-- Custom styles for this template -->
		<link href="css/style.css" rel="stylesheet">
		<link href="css/style-responsive.css" rel="stylesheet" />

		<!-- HTML5 shim and Respond.js IE8 support of HTML5 tooltipss and media queries -->
		<!--[if lt IE 9]>
      <script src="js/html5shiv.js"></script>
      <script src="js/respond.min.js"></script>
    <![endif]-->
	</head>

	<body>

		<section id="container" class="">
			<!--header start-->
			<div id="header">

			</div>
			<!--main content start-->
			<section id="main-content">
				<section class="wrapper">
					<!-- page start-->


					<div class="col-lg-12">
						<section class="panel">
							<header class="panel-heading">
								<p class="text-center invoice-btn" style="text-align: right;">
									<span style="float: left;font-size: 24px;">用户列表</span>
									<a href="director-add.html" class="btn btn-danger btn-lg"> 增加 </a>
								</p>
							</header>
							<div class="x_content">
								<form method="post" action="">
									<input type="hidden" name="pageIndex" value="1" />
									<ul>
										<li>
											<div class="form-group">
												<div class="col-lg-2 col-sm-6 col-xs-12">
													<input id="username" name="username" type="text" v-model="username"
														   class="form-control" placeholder="输入姓名">
												</div>
											</div>
										</li>
										<li>
											<div class="form-group">
												<div class="col-lg-2 col-sm-6 col-xs-12">
													<input id="jobNumber" name="jobNumber" type="text" v-model="jobNumber"
														   class="form-control" placeholder="输入工号">
												</div>
											</div>
										</li>
										<li>
											<button type="button" class="btn btn-primary" @click="query"> 查 &nbsp;&nbsp;&nbsp;&nbsp;询
											</button>
										</li>
									</ul>
								</form>
							</div>
							<table class="table table-striped table-advance table-hover">
								<thead>
									<tr>
										<th><i class="icon-user"></i> 姓名</th>
										<th class="hidden-phone"><i class="icon-user-md"></i> 职位</th>
										<th class="hidden-phone"> 性别</th>
										<th><i class="icon-calendar"></i>入职日期</th>
										<th><i class=" icon-edit"></i> 工号</th>
										<th><i class=" icon-cog"></i> 操作</th>
										<th></th>
									</tr>
								</thead>
								<tbody>
									<tr v-for="empAccount in pageInfo.list">
										<td><a href="#">{{empAccount.userName}}</a></td>
										<td class="hidden-phone">{{empAccount.post}}</td>
										<td>{{empAccount.sex}}</td>
										<td>{{empAccount.hiredate}}</td>
										<td>
											<!-- <span class="label label-info label-mini">博士</span> -->
											<span>{{empAccount.jobNumber}}</span>
										</td>
										<td>
											<span id="xiala"></span>
											<button class="btn btn-primary btn-xs" @click="modify(empAccount.id)"><i
													class="icon-pencil"></i>修改</button>
											<button class="btn btn-danger btn-xs" @click="del(empAccount.id)"><i class="icon-trash "></i>删除</button>
										</td>
									</tr>
								</tbody>
							</table>
							<div class="panel-body">
								<div class="text-center" v-if="pageInfo.list!=null">
									<ul class="pagination pull-right">
										<li><a href="javascript:;" @click="firstPage">首页</a></li>
										<li v-for="item in pageInfo.navigatepageNums" @click="number(item)">
											<a href="javascript:;">{{item}}</a>
										</li>
										<li><a href="javascript:;" @click="lastPage">末页</a></li>
									</ul>
								</div>

							</div>
						</section>

					</div>
					</div>
					<!-- page end-->
				</section>
			</section>
			<!--main content end-->
		</section>

		<!-- js placed at the end of the document so the pages load faster -->
		<script src="js/jquery.js"></script>
		<script src="js/bootstrap.min.js"></script>
		<script src="js/jquery.scrollTo.min.js"></script>
		<script src="js/jquery.nicescroll.js" type="text/javascript"></script>
		<script type="text/javascript" src="assets/data-tables/DT_bootstrap.js"></script>

		<!--common script for all pages-->
		<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/axios.js"></script>
		<script src="localjs/director-list.js"></script>
		<script src="js/common-scripts.js"></script>

	</body>
</html>
